<!DOCTYPE html>
<html lang="en">
<head>
    <title>编辑未关闭事项</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-store, must-revalidate">
    <meta http-equiv="expires" content="Wed, 26 Feb 1997 08:21:57 GMT">
    <meta http-equiv="expires" content="-1">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="refresh" content="1200">
    <link rel="shortcut icon" href="/dist/img/icon.png" type="image/x-icon">
    <!-- Bootstrap 3.3.6 -->
    <link rel="stylesheet" href="/dist/plugins/bootstrap/css/bootstrap.min.css">
    <!--字体-->
    <link rel="stylesheet" href="/dist/css/font-awesome.min.css">
    <!--图标-->
    <link rel="stylesheet" href="/dist/css/ionicons.min.css">
    <!--OA主样式-->
    <link rel="stylesheet" href="/dist/css/OA.min.css?t=86e2297f">
    <link rel="stylesheet" href="/dist/css/skins/OA-skins.min.css?t=222aea35">
    <link rel="stylesheet" href="//at.alicdn.com/t/font_855021_7dwa4qhqvsb.css">
    <link rel="stylesheet" href="/dist/plugins/webuploader-0.1.5/webuploader.css">
    
    <style>
        .td-value1 select {
            box-shadow: inset 1px 1px 4px #333;
            height: 100% !important;
            padding-left: 4px !important;
        }
        .webuploader-pick {
            background: url(/dist/img/fjT1.png) no-repeat 5px center;
            display: block;
            padding: 0 4px;
            height: 22px;
            line-height: 22px;
            padding-left: 15px;
            margin: 0 auto;
            width: 70px;
            border-radius: 4px;
            color: #2a8cec;
        }
        .webuploader-pick-hover {
            color: #fff !important;
            background: url(/dist/img/fjT2.png) no-repeat 5px center;
            background-color: #0F6099;

        }
        .lineOne {
            text-align: left;
        }

        .lineOne span {
            max-height: 20px;
            line-height: 20px;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 1;
            text-align: left;
        }

        .div-td-content-more {
            position: absolute;
            height: auto;
            z-index: 999;
            line-height: 20px;
            background-color: #d3e8fd;
            padding: 8px 6px;
            border: 1px solid #e8e8ea;
            display: none;
        }

        .table-detail input[type=text], .table-detail input[type=number], 
        .table-detail input[type=tel], .table-detail select,
        .table-detail textarea{
            padding-left: 0px;
        }
        

        .div-td-content-more i {
            width: 15px;
            height: 12px;
            background: url("/dist/img/more-icon.png");
            position: absolute;
            left: 50px;
            top: -12px;
        }

        .tdColor {
            width:120px !important;
            background-color: #f8f8f8;
        }

        .tdColor .icon-ren,.tdColor .icon-ren3{
            position: absolute;
            font-size: 16px;
        }
        .tdColor .icon-bixutian{
            font-size: 12px;
            color: red;
        }

        .td-value {
            text-align: left !important;
            vertical-align: middle;
            word-wrap: break-word;
            color: #2a8cec !important;
        }

        .td-value span {
            display: inline-block;
            max-height: 56px;
            overflow: hidden;
            padding: 0 6px;
            word-wrap: break-word;
            text-align: center !important;
        }
        .td-value1 {
            text-align: left !important;
            vertical-align: middle;
            word-wrap: break-word;
            color: #2a8cec !important;
        }
        .td-value1 .user{
            display: inline-block;
            float: left;
            overflow: hidden;
            cursor: pointer;
        }
        .user.select{
            color: #fff;
            background-color: #045B9E;
        }
        .td-value1 input,textarea{
            width: 100%;
            border: 0;
            outline: none;
        }
        .table-detail td{
            padding-left: 2px !important;
        }
        .weChat{
            position: absolute;
            left: 200px;
            margin-top: 2px;
        }
        .weChat input{
            position: absolute;
            bottom: 18px;
            left: -15px;
        }
        .icon-zk,.icon-sq{
            color: #2a8cec;
            font-size: 16px;
            top: 3px;
            margin-left: 10px;
            cursor: pointer;
        }
        .trZW td{
            height: 0;
            border: 0
        }
        span.lineOne{
            line-height: 27px !important;
            height: 28px;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 1;
        }
        .ui_dialog,.ui_inner,table.ui_border{
            border: 0 !important;
        }
        .zksq{
            color: #2a8cec;font-size: 16px;cursor: pointer;
            width: 200px;
            margin: 0 auto;
        }
    </style>
</head>
<body>
<iframe id="ifAttach" style="display:none"></iframe>
<div class="div-td-content-more"><i></i></div>
<section class="content" id="app">
    <div class="tableTitle" style="height: 30px;line-height: 30px;text-align: center;border:1px solid #e8e8e9;border-bottom: 0">基本信息</div>
    <table class="table-detail">
        <tbody>
            <tr class="trZW">
                <td class="tdColor"></td>
                <td></td>
                <td class="tdColor"></td>
                <td></td>
                <td class="tdColor"></td>
                <td></td>
                <td class="tdColor"></td>
                <td></td>
            </tr>
            <tr>
                <td class="tdColor">事项名称</td>
                <td colspan="7" class="td-value1">
                    <input type="text" v-if="isPublisher && detailParm.jobState=='0'" v-model="detailParm.trackTitle"/>
                    <input type="text" v-if="isPublisher && detailParm.jobState!='0'" readonly v-model="detailParm.trackTitle"/>
                    <input type="text" v-if="!isPublisher" readonly v-model="detailParm.trackTitle"/>
                </td>
            </tr>
            <tr>
                <td class="tdColor">事项内容描述</td>
                <td colspan="7" class="td-value1">
                    <textarea rows="7"  v-if="isPublisher && detailParm.jobState=='0'" style="resize: none;padding:2px 0 0 2px !important" v-model="detailParm.trackContent"></textarea>
                    <textarea rows="7"  v-if="isPublisher && detailParm.jobState!='0'" style="resize: none;padding:2px 0 0 2px !important" v-model="detailParm.trackContent"></textarea>
                    <textarea rows="7"  v-if="!isPublisher" readonly style="resize: none;padding:2px 0 0 2px !important" v-model="detailParm.trackContent"></textarea>
                </td>
            </tr>
            <tr v-for="(item,i) in detailParm.followList">
                <td class="tdColor">后续内容描述{{i+1}}</td>
                <td colspan="7" class="td-value1" style="vertical-align: top;height: 50px;line-height: 15px;padding-left: 3px !important;">
                    {{item.content}}
                </td>
            </tr>
            <tr>
                <td class="tdColor">预计开始日期</td>
                <td class="td-value1">
                    <input type="text" v-if="isPublisher && detailParm.jobState=='0'" @focus="showDatePicker($event,detailParm,'startTime')" v-model="detailParm.startTime"/>
                    <input type="text" v-if="isPublisher && detailParm.jobState=='2'" @focus="showDatePicker($event,detailParm,'startTime')" v-model="detailParm.startTime"/>
                    <input type="text" v-if="isPublisher && detailParm.jobState=='5'" @focus="showDatePicker($event,detailParm,'startTime')" v-model="detailParm.startTime"/>
                    <input type="text" v-if="isPublisher && detailParm.jobState=='1'" readonly v-model="detailParm.startTime"/>
                    <input type="text" v-if="isPublisher && detailParm.jobState=='3'" readonly v-model="detailParm.startTime"/>
                    <input type="text" v-if="isPublisher && detailParm.jobState=='4'" readonly v-model="detailParm.startTime"/>
                    <input type="text" v-if="!isPublisher" readonly v-model="detailParm.startTime"/>
                </td>
                <td class="tdColor">预计结束日期</td>
                <td class="td-value1">
                    <input type="text" v-if="isPublisher && detailParm.jobState=='0'" @focus="showDatePicker($event,detailParm,'predictTime')" v-model="detailParm.predictTime"/>
                    <input type="text" v-if="isPublisher && detailParm.jobState=='2'" @focus="showDatePicker($event,detailParm,'predictTime')" v-model="detailParm.predictTime"/>
                    <input type="text" v-if="isPublisher && detailParm.jobState=='5'" @focus="showDatePicker($event,detailParm,'predictTime')" v-model="detailParm.predictTime"/>
                    <input type="text" v-if="isPublisher && detailParm.jobState=='1'" readonly v-model="detailParm.predictTime"/>
                    <input type="text" v-if="isPublisher && detailParm.jobState=='3'" readonly v-model="detailParm.predictTime"/>
                    <input type="text" v-if="isPublisher && detailParm.jobState=='4'" readonly v-model="detailParm.predictTime"/>
                    <input type="text" v-if="!isPublisher" readonly v-model="detailParm.predictTime"/>
                </td>
                <td class="tdColor">状态</td>
                <td colspan="3" class="td-value1" v-if="isPublisher && (detailParm.jobState=='0'||(detailParm.jobState=='4' && stateUdate==true ))">
                    <select id="testMod" class="td-row2 td-value" v-model="detailParm.jobState" @change="stateOpera(detailParm.jobState)">
                        <option value="0">待处理</option>
                        <option value="4">已撤销</option>
                    </select>
                </td>
                <td colspan="3" class="td-value1" v-if="isPublisher && (detailParm.jobState=='2'||(detailParm.jobState=='3' && stateUdate==true)||detailParm.jobState=='5')">
                    <select id="testMod" class="td-row2 td-value" v-model="detailParm.jobState" @change="stateOpera(detailParm.jobState)">
                        <option value="2" v-if="oldJobState==2">处理中</option>
                        <option value="5" v-if="oldJobState==5">后续-处理中</option>
                        <option value="3">已完成-待审核</option>
                    </select>
                </td>
                <template v-if="isPublisher && (detailParm.jobState=='1' || (((detailParm.jobState=='3'||detailParm.jobState=='4') && stateUdate==false)))">
                    <td colspan="3"  class="td-value1" v-if="detailParm.jobState=='0'"  >待处理</td>
                    <td colspan="3" class="td-value1" v-if="detailParm.jobState=='1'"  >已关闭</td>
                    <td colspan="3" class="td-value1" v-if="detailParm.jobState==2"  >处理中</td>
                    <td colspan="3" class="td-value1" v-if="detailParm.jobState==3"  >已完成-待审核</td>
                    <td colspan="3" class="td-value1" v-if="detailParm.jobState==4"  >已撤销</td>
                    <td colspan="3" class="td-value1" v-if="detailParm.jobState==5"  >后续-处理中</td>
                </template>
                <template v-if="!isPublisher">
                    <td colspan="3" class="td-value1" v-if="detailParm.jobState=='0'"  >待处理</td>
                    <td colspan="3" class="td-value1" v-if="detailParm.jobState=='1'"  >已关闭</td>
                    <td colspan="3" class="td-value1" v-if="detailParm.jobState==2"  >处理中</td>
                    <td colspan="3" class="td-value1" v-if="detailParm.jobState==3"  >已完成-待审核</td>
                    <td colspan="3" class="td-value1" v-if="detailParm.jobState==4"  >已撤销</td>
                    <td colspan="3" class="td-value1" v-if="detailParm.jobState==5"  >后续-处理中</td>
                </template>
            </tr>
            <tr>
                <td class="tdColor"></span>负责人</td>
                <td class="td-value1" >
                    <div id="principal" style="padding-left:2px">
                        <div v-for="(user,i) in detailParm.principal" class="user"
                            v-bind:class="{ select: principalSelectedIdx == i }"
                            v-on:click="selectUser(i,'principalSelectedIdx')">{{user.userName}}{{(detailParm.principal.length-i==1)?'':','}}
                        </div>
                    </div>
                    <input class="pull-left principal" style="width:50px" :placeholder="detailParm.principal.length==0?'只能输入一个人':''"
                            type="text" @keyup.delete="delPrincipal" @blur="blurInput('principalSelectedIdx')"/>
                </td>
                <td class="tdColor"></span>参与人</td>
                <td class="td-value1"  colspan="5">
                    <div id="cyrPerson" style="padding-left:2px;">
                        <div v-for="(user,i) in detailParm.cyrPerson" class="user"
                            v-bind:class="{ select: cyrPersonSelectedIdx == i }"
                            v-on:click="selectUser(i,'cyrPersonSelectedIdx')">{{user.userName}}{{(detailParm.cyrPerson.length-i==1)?'':','}}
                        </div>
                        <input v-if="isPrincipal && (detailParm.jobState==0||detailParm.jobState==2||detailParm.jobState==5)"
                            class="pull-left cyrPerson" style="width:50px" :placeholder="detailParm.cyrPerson.length==0?'可以输入多人':''"
                            type="text" @keyup.delete="delcyrPerson"  @blur="blurInput('cyrPersonSelectedIdx')"/>
                    </div>
                </td>
            </tr>
            <tr>
                <td class="tdColor"></span>抄送人</td>
                <td colspan="7" class="td-value1">
                    <div id="csrPerson" style="padding-left:2px;">
                        <div v-for="(user,i) in detailParm.csrPerson" class="user"
                            v-bind:class="{ select: csrPersonSelectedIdx == i }"
                            v-on:click="selectUser(i,'csrPersonSelectedIdx')">{{user.userName}}{{(detailParm.csrPerson.length-i==1)?'':','}}
                        </div>
                        <input v-if="isPrincipal && (detailParm.jobState==0||detailParm.jobState==2||detailParm.jobState==5)" class="pull-left csrPerson" style="width:50px" :placeholder="detailParm.csrPerson.length==0?'可以输入多人':''"
                            type="text" @keyup.delete="delcsrPerson" @blur="blurInput('csrPersonSelectedIdx')"/>
                    </div>
                </td>
            </tr>
            <tr>
                <td class="td-value1" v-if="isPublisher && detailParm.jobState==0">
                    <div id="divUpload">添加附件</div>
                </td>
                <td v-else class="tdColor">附件</td>
                <td :colspan="7" class="td-value1">
                    <div id="divUploadedFiles">
                        <div v-for="(attach,i) in detailParm.attaches" class="fj-tanzhongStyle">
                            <b :class="fjStyle(attach.name)"></b>
                            <div class="name" v-if="attach.name" :title="attach.name">
                                {{attach.name}}
                            </div>
                            <div class="down">
                                <a href="javascript:void(0)" class="nui-txt-link" @click="download(attach.url,attach.name)">下载</a>
                            </div>
                            <div class="del" v-if="isPublisher && detailParm.jobState==0">
                                <a href="javascript:void(0)" class="nui-txt-link" @click="deleteFile(i)">删除</a>
                            </div>
                            <!--<div class="info"><span class="nui-txt-suc">上传完成</span></div>-->
                        </div>
                    </div>
                </td>
                
            </tr>
            <template v-if="(detailParm.jobState!=0 && stateUdate==false) ||  detailParm.jobState==3 && stateUdate==true">
                <tr>
                    <td colspan="8" class="tableTitle">
                        事项跟踪记录
                        <span v-if="(isPrincipal || isCyr) && (detailParm.jobState==2||detailParm.jobState==5)" @click="addTrack()" style="position:absolute;right:0;margin-right:5px;cursor: pointer;color: #2a8cec">新增记录</span>
                    </td>
                </tr>
                <tr v-if="detailParm.trackList.length == 0"><td colspan="8" style="height:50px;font-size:20px">暂无跟踪</td></tr>
                <tr v-if="detailParm.trackList.length > 0">
                    <td class="tdColor">跟踪人员</td>
                    <td class="tdColor">跟踪时间</td>
                    <td class="tdColor" colspan="6">跟踪内容</td>
                </tr>
                <tr v-for="(trackItem,i) in detailParm.trackList" v-if="i>2?zkTrack:true">
                    <td class="td-value1" style="text-align:center !important;">
                        {{trackItem.USER_NAME}}
                    </td>
                    <td class="td-value1" style="text-align:center !important;">
                        {{trackItem.CREATE_TIME}}
                    </td>
                    <td colspan="6" class="td-value1">
                        <p style="line-height:15px;margin: 0">
                            {{trackItem.TRACK_CONTENT}}
                        </p>
                    </td>
                </tr>
            </template>
        </tbody>
    </table>
    <div v-if="detailParm.trackList.length>3" style="text-align: center;padding-top:5px;">
        <div v-if="!zkTrack" class="zksq"  @click="operatTrack()">展开全部<span class="iconfont icon-zk"></span></div>
        <div v-if="zkTrack" class="zksq" @click="operatTrack()">收起<span class="iconfont icon-sq" ></span></div>
    </div>
    
    <div class="south" :ddxx="detailParm.jobState" style="height:50px;line-height:50px;text-align:center;">
        <input v-if="isPrincipal && detailParm.jobState==3 && stateUdate==false"  type="button" value="通过" class="btn oaBtn btn-sm" @click="operatingStatus('1')"/>
        <input v-if="isPrincipal && detailParm.jobState==3 && stateUdate==false"  type="button" value="驳回" class="btn oaBtn btn-sm" @click="operatingStatus('2')"/>
        <input v-if="(isPublisher|| isPrincipal) && (detailParm.jobState==0 ||detailParm.jobState==2 || ((detailParm.jobState==3||detailParm.jobState==4)&& stateUdate==true) || detailParm.jobState==5)"  type="button" value="保存" class="btn oaBtn btn-sm" @click="submitData()"/>
        <input v-if="isPublisher && (detailParm.jobState==2 || detailParm.jobState==5 || (detailParm.jobState==3 && stateUdate==true))" 
            type="button" value="新增后续内容" class="btn oaBtn btn-sm" @click="addFollow()" style="margin-left:20px"/>
    </div>
</section>
<!--JQ-->
<script src="https://file.ggxqce.com/web/jquery-2.2.3.min.js"></script>
<!--插件JS-->
<script src="https://file.ggxqce.com/web/bootstrap.min.js"></script>
<!--框架已定义 JS-->
<script src="/dist/js/app_iframe.js?t=8e743a31"></script>
<!--oa自定义  JS-->
<script src="/dist/js/oa.js?t=54c6b89c"></script>
<script src="https://file.ggxqce.com/web/vue.min.js"></script>
<script type="text/javascript" src="/dist/plugins/lhgdialog/lhgdialog.min.js?self=true"></script>
<script type="text/javascript" src="/dist/plugins/My97DatePicker/WdatePicker.js"></script>
<script src="/dist/plugins/webuploader-0.1.5/webuploader.min.js"></script>
<script type="text/javascript" src="/dist/js/pages/common/commonService.js"></script>
<script type="text/javascript">
    // var api = frameElement.api, W = api.opener;
    var app = new Vue({
        el: '#app',
        data: {
            pageType:"add",  //add or edit
            csrPersonSelectedIdx: -1,
            cyrPersonSelectedIdx:-1,
            principalSelectedIdx:-1,
            stateUdate:false,
            isPublisher:true,//是发布人
            isPrincipal:true, //不是负责人
            isCyr:true,
            isCsr:true,
            zkTrack:false,
            oldJobState:"0",
            // addFollow:false,
            detailParm:{
                id:"",
                checked:false,
                principal:[],  //负责人
                csrPerson:[],  //抄送人
                cyrPerson:[],  //参与人
                trackTitle:"",
                trackContent:"",
                jobState:"0",
                isNewUnfinish:"4",
                statusChanged:false,
                trackList:[],
                predictTime:"", //预计结束日期
                publisher:"",//发布人ID
                userId:"",
                userName:"",
                currentUser:getCurrentUser(),
                attaches: [],//附件
                followList: [],
            },
            uploader: null,
            
        },
        methods: {
            submitData:function(){
                if(this.detailParm.trackTitle == ""){
                    alert("标题不能为空！");
                    return false;
                }
                if(this.detailParm.principal.length==0){
                    alert("负责人不能为空！");
                    return false;
                }
                if(this.detailParm.predictTime == ""){
                    alert("预计结束日期不能为空！");
                    return false;
                }
                if(this.detailParm.trackContent==""){
                    alert("事项内容不能为空！");
                    return false;
                }
                if(this.detailParm.cyrPerson.length==0 && this.isPrincipal && this.detailParm.jobState!=4){
                    alert("参与人不能为空！");
                    return false;
                }
                if(this.detailParm.csrPerson.length==0 && this.isPrincipal && this.detailParm.jobState!=4){
                    alert("抄送人不能为空！");
                    return false;
                }
                if($(".weChat input").is(':checked')){
                    this.detailParm.checked = true;
                }

                if(this.oldJobState==0 && this.isPrincipal && this.detailParm.csrPerson.length>0 && this.detailParm.cyrPerson.length>0){
                    this.detailParm.jobState=2;
                    this.detailParm.statusChanged=true;
                }
                if(this.detailParm.jobState!=this.oldJobState)
                    this.detailParm.statusChanged=true;
                
                $.wyui.postMethod(urlConfig.wreport.wreportUnfinish.saveUnfinish, trimRN(this.detailParm), function (data) {
                    // alert('操作成功');
                    var pageId = top.getActivePageId();
                    var $iframe = top.findIframeByName("事项管理");
                    $iframe[0].contentWindow.app.refresh(true);
                    top.closeTabByPageId(pageId);
                });
            },
            stateOpera:function(stateOpera){
                if(stateOpera == 3 || stateOpera == 4)
                    this.stateUdate =true;
                else
                    this.stateUdate =false;
            },
            operatTrack:function(){
                if(this.zkTrack){
                    this.zkTrack =false;
                }else{
                    this.zkTrack =true;
                }
            },
            operatingStatus:function(status){
                var that=this;
                $.wyui.postMethod(urlConfig.wreport.wreportUnfinish.updateStatus, 
                {mainId:that.detailParm.id,jobStatus:status,statusChanged:true}, 
                function (data) {
//                    alert("操作成功");
                    // parent.refresh(true);
                    // api.close();
                    // alert('操作成功');
                    var pageId = top.getActivePageId();
                    var $iframe = top.findIframeByName("事项管理");
                    $iframe[0].contentWindow.app.refresh(true);
                    top.closeTabByPageId(pageId);
                });
            },
            showDatePicker: function (e, item,type) {
                WdatePicker({
                    onpicked: function (dp) {
                        if(type == 'startTime')
                            item.startTime = dp.cal.getNewDateStr();
                        else
                            item.predictTime = dp.cal.getNewDateStr();
                        return true;
                    }
                });
                $(e.target).blur();
            },
            selectUser: function (i, prop) {
                // this.csrPersonSelectedIdx =1;
                // alert(i+"_11_"+prop+"_0_"+this[prop]);
                var v = this[prop];
                if(this[prop] == i)
                    this[prop] = -1;
                else
                    this[prop] = i;
            },
            blurInput(prop){
                this[prop] = -1;
            },
            delPrincipal: function (event) {
                if (event.keyCode == 46 || event.keyCode == 8 && event.target.value == "") {
                    if (this.principalSelectedIdx > -1) {
                        this.detailParm.principal.splice(this.principalSelectedIdx, 1);
                        this.principalSelectedIdx = -1;
                    } else {
                        this.principalSelectedIdx = this.detailParm.principal.length - 1;
                    }
                }
            },
            delcsrPerson: function (event) {
                if (event.keyCode == 46 || event.keyCode == 8 && event.target.value == "") {
                    if (this.csrPersonSelectedIdx > -1) {
                        this.detailParm.csrPerson.splice(this.csrPersonSelectedIdx, 1);
                        this.csrPersonSelectedIdx = -1;
                    } else {
                        this.csrPersonSelectedIdx = this.detailParm.csrPerson.length - 1;
                    }
                }
            },
            delcyrPerson: function (event) {
                if (event.keyCode == 46 || event.keyCode == 8 && event.target.value == "") {
                    if (this.cyrPersonSelectedIdx > -1) {
                        this.detailParm.cyrPerson.splice(this.cyrPersonSelectedIdx, 1);
                        this.cyrPersonSelectedIdx = -1;
                    } else {
                        this.cyrPersonSelectedIdx = this.detailParm.cyrPerson.length - 1;
                    }
                }
            },
            addTrack:function(){
                var that =this;
                var sTitle = trimRN2(that.detailParm.trackTitle)==''?'添加跟踪':'添加跟踪（' + that.detailParm.trackTitle.substring(0,25)+ '）';
                $.dialog({
                    content: 'url:addTrack.html?mainId=' + that.detailParm.id+'&userName=' + that.detailParm.userName + '&principal=' + + that.detailParm.principal[0].id + '&publisher=' + that.detailParm.publisher + '&trackTitle=' + that.detailParm.trackTitle.substring(0,25),
                    title: sTitle,
                    width: 700,
                    height: 250,
                    max: false,
                    min: false,
                    lock: true
                });
            },
            addFollow:function(){
                var that =this;
                $.dialog({
                    content: 'url:detail.html?pageType=addFollow&id=' + that.detailParm.id,
                    title: '新增事项后续内容',
                    width: 700,
                    height: 450,
                    max: false,
                    min: false,
                    lock: true
                });
            },
            initDetail:function(){
                var that = this;
                that.detailParm.id = $.wyui.page.urlParams.id;
                $.wyui.postMethod(urlConfig.wreport.wreportUnfinish.getWReportUnfinishById, trimRN(this.detailParm), function (data) {
                    that.detailParm.publisher = data.USER_ID;
                    that.detailParm.trackTitle = data.TRACK_TITLE;
                    that.detailParm.trackContent = data.TRACK_CONTENT;
                    that.detailParm.predictTime = data.PREDICT_TIME;
                    that.detailParm.startTime = data.START_TIME;
                    that.detailParm.jobState = data.JOB_STATE;
                    that.oldJobState = data.JOB_STATE;
                    that.detailParm.trackList = data.trackList;
                    that.detailParm.userId = data.USER_ID;
                    that.detailParm.userName = data.USER_NAME;
                    if(data.followList!=""){
                        that.detailParm.followList = data.followList;
                    }
                    that.detailParm.attaches = data.attaches;

                    that.detailParm.principal =[];
                    var objPrincipal = {"id":data.PRINCIPAL,"userName":data.PRINCIPAL_NAME}
                    that.detailParm.principal.push(objPrincipal);


                    if(data.csr!=undefined&&data.csr.length>0){
                        var csrPersons = data.csr.split(';');
                        var csrPersonNames = data.csrName.split(',');
                        that.detailParm.csrPerson=[];
                        csrPersons.forEach((item , i) => {
                            if(item == "") return false;
                            var obj = new Object();
                            obj.id = item;
                            obj.userName = csrPersonNames[i];
                            that.detailParm.csrPerson.push(obj);
                        });
                    }

                    if(data.cyr!=undefined&&data.cyr.length>0){
                        var cyrPersons = data.cyr.split(';');
                        var cyrPersonNames = data.cyrName.split(',');
                        that.detailParm.cyrPerson=[];
                        cyrPersons.forEach((item , i) => {
                            if(item == "") return false;
                            var obj = new Object();
                            obj.id = item;
                            obj.userName = cyrPersonNames[i];

                            that.detailParm.cyrPerson.push(obj);
                        });
                    }

                    if(that.detailParm.currentUser.id == data.USER_ID){
                        that.isPublisher=true;
                    }else{
                        that.isPublisher=false;
                    }

                    if(that.detailParm.currentUser.id == data.PRINCIPAL){
                        that.isPrincipal=true;
                    }else{
                        that.isPrincipal=false;
                    }

                    if(data.cyr!=undefined && data.cyr.indexOf(that.detailParm.currentUser.id)>-1){
                        that.isCyr=true;
                    }else{
                        that.isCyr=false;
                    }
                    if(data.csr!=undefined && data.csr.indexOf(that.detailParm.currentUser.id)>-1){
                        that.isCsr=true;
                    }else{
                        that.isCsr=false;
                    }
                });

                
                // var principal = $.wyui.page.urlParams.principal;
                // var principalName = $.wyui.page.urlParams.principalName;
                // if(principal != "") {
                //     var objPrincipal = {"id":principal,"userName":principalName}
                //     this.detailParm.principal.push(objPrincipal);
                // }

                // var csrPersons = $.wyui.page.urlParams.csrPerson.split(';');
                // var csrPersonNames = $.wyui.page.urlParams.csrPersonName.split('/');
                // csrPersons.forEach((item , i) => {
                //     if(item == "") return false;
                //     var obj = new Object();
                //     obj.id = item;
                //     obj.userName = csrPersonNames[i];
                //     this.detailParm.csrPerson.push(obj);
                // });

                // var cyrPersons = $.wyui.page.urlParams.cyrPerson.split(';');
                // var cyrPersonNames = $.wyui.page.urlParams.cyrPersonName.split('/');
                // cyrPersons.forEach((item , i) => {
                //     if(item == "") return false;
                //     var obj = new Object();
                //     obj.id = item;
                //     obj.userName = cyrPersonNames[i];

                //     this.detailParm.cyrPerson.push(obj);
                // });
            },
            initUpload:function(){
                var that = this;
                this.uploader = WebUploader.create({
                    // 选完文件后，是否自动上传。
                    auto: true,
                    // swf文件路径
                    swf: "/statics/plugin/webuploader-0.1.5/Uploader.swf",
                    // 文件接收服务端。
                    server: server.ip +"/attach/uploadFile.json",
                    // 选择文件的按钮。可选。
                    // 内部根据当前运行是创建，可能是input元素，也可能是flash.
                    pick: '#divUpload',
                    duplicate: true
                });
                this.uploader.on("uploadStart", function () {
                    $("#progress").show();
                });
                this.uploader.on("uploadComplete", function () {
                    $("#progress").hide();
                });
                // 文件上传成功，给item添加成功class, 用样式标记上传成功。
                this.uploader.on('uploadSuccess', function (file, response) {
                    if (response._raw == "文件上传出错！") {
                        alert("文件上传出错！");
                    } else {
                        that.detailParm.attaches.push({
                            id: response.id,
                            name: response.name,
                            url: response.url
                        });
                    }
                });
                // 文件上传失败，显示上传出错。
                this.uploader.on('uploadError', function (file) {
                    alert("上传失败！");
                });
            },
            fjStyle: function (fjName) {
                if (fjName) {
                    var type = fjName.substring(fjName.lastIndexOf('.') + 1);
                    return 'img fj-' + type
                }
                return 'img'
            },
            download: function (attachId, fileName) {
                downloadFile(attachId,fileName)
                return false;
            },
            deleteFile: function (i) {
                if (window.confirm("确定要删除该附件吗?")) {
                    this.detailParm.attaches.splice(i, 1);
                }
            }
        },
        mounted: function () {
            this.pageType = $.wyui.page.urlParams.pageType;
            this.initUpload();
            if(this.pageType == "edit"){
                this.initDetail();
            }
        }
    });

    function refresh(toStart) {
        app.initDetail()
    }

</script>
<script>
    $(function(){
        $("body").on("click", ".lineOne", function (e) {
            if ($(".div-td-content-more").is(":hidden")) {
                var text = $(this).text();
                if (text != "") {
                    
                    text = "<i></i>" + text;
                    $(".div-td-content-more").html(text).css({
                        "width": $(this).outerWidth() + 12 + "px",
                        "left": $(this).offset().left - 6,
                        "top": ($(this).offset().top + $(this).outerHeight()) + "px"
                    }).show();
                    e.stopPropagation();
                }
            } else {
                $(".div-td-content-more").hide();
            }
        });
        $("body").on("click", ".div-td-content-more", function (e) {
            e.stopPropagation();
        });
        $("body").on("click", function () {
            $(".div-td-content-more").hide();
        });

        $(".csrPerson,.cyrPerson,.principal").autoComplete({
            url: server.ip + urlConfig.system.user.getTop10ByNameUser,
            render: function (users, panel) {
                for (var i = 0; i < users.length; i++) {
                    $("<li></li>").data("autoComplete",
                        users[i]).html("<a>" + users[i].name + "&nbsp;&nbsp;&nbsp;" +
                        "(" + "&nbsp;" + users[i].companyName + "-" + users[i].departName + "-" + users[i].roleName + "&nbsp;" + ") " + "</a>")
                        .appendTo(panel);
                }
            },
            selected: function (user) {
                if ($(this).hasClass("csrPerson")) {
                    var userIds = new Array();
                    for (var i = 0; i < app.detailParm.csrPerson.length; i++) {
                        userIds.push(app.detailParm.csrPerson[i].id);
                    }
                    if ($.inArray(user.id, userIds) == -1) {
                        app.detailParm.csrPerson.push({id: user.id, userName: user.name});
                        app.csrPersonSelectedIdx = -1;
                    } else {
                        alert("抄送人不能重复输入");
                    }
                    $(this).val("");
                }else if ($(this).hasClass("cyrPerson")) {
                    var userIds = new Array();
                    for (var i = 0; i < app.detailParm.cyrPerson.length; i++) {
                        userIds.push(app.detailParm.cyrPerson[i].id);
                    }
                    if ($.inArray(user.id, userIds) == -1) {
                        app.detailParm.cyrPerson.push({id: user.id, userName: user.name});
                        app.cyrPersonSelectedIdx = -1;
                    } else {
                        alert("参与人不能重复输入");
                    }
                    $(this).val("");
                }else if ($(this).hasClass("principal")) {
                    var userIds = new Array();
                    for (var i = 0; i < app.detailParm.principal.length; i++) {
                        userIds.push(app.detailParm.principal[i].id);
                    }
                    if (userIds.length == 0) {
                        app.detailParm.principal.push({id: user.id, userName: user.name});
                        app.principalSelectedIdx = -1;
                    } else {
                        alert("负责人只能输入一个");
                    }
                    $(this).val("");
                }
                return false;
            },
            height: 180,
            width: 300
        });

    });
</script>

</body>
</html>